@use "sass:map";

@font-face {
	font-family: SimDefaultFont;
	src: url(/wotlk/assets/fonts/PlusJakartaSans-Regular.woff2);
}

@font-face {
	font-family: SimDefaultFont;
	src: url(/wotlk/assets/fonts/PlusJakartaSans-Bold.woff2);
	font-weight: bold;
}

:root {
  --bs-body-font-family: SimDefaultFont;
  --bs-body-line-height: 1.25;
}

.container {
  height: 100%;
  display: flex;
}

.dropdown-menu {
  &[data-bs-popper] {
    margin: 0 !important;
  }
}

.form-check {
  padding: 0;

  &.form-check-reverse {
    text-align: left;

    .form-check-input {
      margin: 0;
    }
  }
}

.form-check-input {
  width: $form-check-input-width !important;
  height: $form-check-input-width !important;

  &:focus {
    box-shadow: 0 0 .25rem var(--bs-primary);
  }

  &:checked[type="checkbox"] {
    background-color: var(--bs-primary);
    background-image: var(--bs-form-check-box-bg-image);
  }

  &:checked[type="radio"] {
    background-color: var(--bs-primary);
    background-image: var(--bs-form-check-radio-bg-image);
  }
}

.link-warning {
  color: $link-warning-color !important;
}

.link-danger {
  color: $link-danger-color !important;
}

.link-success {
  color: $success !important;
}

.modal {
  .modal-dialog {
    .modal-header,
    .modal-footer {
      padding-left: 0;
      padding-right: 0;
      margin-left: $modal-header-padding;
      margin-right: $modal-header-padding;
    }

    .modal-header {
      align-items: flex-start;
    }

    .modal-body {
      display: flex;
      flex-direction: column;
    }
  }
}

.navbar {
  .navbar-toggler {
    border: 0;
    box-shadow: none;
    color: white;
  }

  .nav-link {
    display: flex;
    align-items: center;
    white-space: nowrap;
  }
}

.nav-tabs {
  .nav-item {
    display: flex;
    align-items: center;

    .nav-link {
      height: 100%;
      margin-bottom: 0;
      border: 0;
      display: flex;
      align-items: center;
      font-weight: bold;
      white-space: nowrap;

      &.active {
        position: relative;

        &::after {
          content: "";
          position: absolute;
          height: 2px;
          background: $nav-tabs-link-active-color;
          bottom: 0;
          left: 0;
          right: 0;
        }
      }
    }
  }
}

.tooltip {
  .tooltip-inner {
    border: 1px solid $link-color;
  }
}

.popover-arrow,
.tooltip-arrow {
  display: none !important;
}

@each $color, $value in $class-colors {
  // Dampened class themes
  .bg-#{$color}-dampened {
    background: mix(black, $value, 75%);
  }
}

@include media-breakpoint-down(xl) {
  .tooltip {
    --bs-tooltip-max-width: #{$tooltip-max-width-lg};
  }
}

@include media-breakpoint-down(lg) {
  .container {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}

@include media-breakpoint-down(md) {
  .navbar {
    .navbar-collapse {
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 1rem;
      background: rgba(0,0,0,.9);
      z-index: 1000;
  
      .navbar-nav {
        position: relative;
        align-items: flex-start;

        .navbar-toggler {
          position: absolute;
          top: 0;
          right: 0;
        }

        .nav-link {
          padding-bottom: map.get($spacers, 3);

          &:first-of-type {
            padding-top: map.get($spacers, 2);
          }
        }
      }
    }
  }
}

@include media-breakpoint-down(md) {
  .tooltip {
    --bs-tooltip-max-width: #{$tooltip-max-width-sm};
  }
}
